var login = document.getElementById('login')
var sign = document.getElementById('sign')
var log = document.getElementById('log')
var logP = document.getElementById('logP')
var sig = document.getElementById('sig')
var usernameC = false
var passwordC = false
console.log(sign)
sign.addEventListener('click', function() {
	logP.classList.remove("hidden");
	logP.classList.add("show");
	sig.classList.remove('hidden');
	sig.classList.add('show');
	// 页面载入动画
	const registerCard = document.querySelector('.register-card');
	const loginCard = document.querySelector('.login-card');
	setTimeout(() => {
		registerCard.classList.add('loaded');
	}, 100);

	// 设置生日为18年前的今天
	function setDefaultBirthday() {
		const today = new Date();
		const eighteenYearsAgo = new Date(today.getFullYear() - 18, today.getMonth(), today.getDate());
		const formattedDate = eighteenYearsAgo.toISOString().split('T')[0];
		document.getElementById('birthday').value = formattedDate;
	}

	setDefaultBirthday();

	// 用户名验证
	const usernameInput = document.getElementById('username');
	const statusText = document.getElementById('statusText');

	usernameInput.addEventListener('input', function() {
		const username = this.value.trim();
		let test = /^(?=.*[a-zA-Z])(?=.*\d)[a-zA-Z\d]{3,15}$/;
		if (username.length < 3) {
			statusText.textContent = '用户名长度至少为3个字符';
			statusText.style.color = 'var(--gray-dark)';
		}else {
			if(!test.test(username)){
				statusText.textContent = '用户名不合格，长度应为3-15个字符，且为字母和数字的组合';
				statusText.style.color = 'var(--gray-dark)';
			}else{
				statusText.textContent = '';
				statusText.style.color = 'var(--gray-dark)';
				usernameC = true
			}
		}


	});

	// 密码显示/隐藏切换
	const togglePassword = document.getElementById('togglePasswords');
	const passwordInput = document.getElementById('passwords');
	const passwordText = document.getElementById('passwordText');
	passwordInput.addEventListener('input', function() {
		const password = this.value.trim();
		let test = /^(?=.*[a-zA-Z])(?=.*\d)[a-zA-Z\d]{3,15}$/;
		if(!test.test(password)){
			passwordText.textContent = '密码不合格，长度应为6-15个字符，且为字母和数字的组合';
		}else{
			passwordText.textContent = '';
			passwordC = true
		}
	})
	
	togglePassword.addEventListener('click', function() {
		const type = passwordInput.getAttribute('type') === 'password' ? 'text' : 'password';
		passwordInput.setAttribute('type', type);

		// 切换眼睛图标
		togglePassword.textContent = type === 'password' ? '👁️' : '🔒';
	});

	// 头像上传预览
	const avatarContainer = document.getElementById('avatarContainer');
	const userAvatar = document.getElementById('userAvatar');
	const headImgInput = document.getElementById('headImg');
	const avatarPlaceholder = document.querySelector('.avatar-placeholder');
	const uploadBtn = document.getElementById('uploadBtn');

	avatarPlaceholder.addEventListener('click', function() {
		headImgInput.click();
	});

	uploadBtn.addEventListener('click', function(e) {
		e.preventDefault();
		headImgInput.click();
	});

	headImgInput.addEventListener('change', function() {
		const file = this.files[0];
		if (file) {
			const reader = new FileReader();

			reader.onload = function(e) {
				userAvatar.src = e.target.result;
				avatarContainer.classList.add('avatar-loaded');
			}

			reader.readAsDataURL(file);
		}
	});

	avatarContainer.addEventListener('click', function() {
		headImgInput.click();
	});

	// 表单提交处理
	const registerForm = document.getElementById('registerForm');
	const responseMessage = document.getElementById('responseMessage');
	const registerBtn = document.getElementById('registerBtn');
	const registerBtnText = document.getElementById('registerBtnText');
	let test = /^(?=.*[a-zA-Z])(?=.*\d)[a-zA-Z\d]{3,15}$/;
	$('#headImg').on('change', function() {
		console.log(1)
		if (this.files && this.files.length > 0) {
			$('#uploadBtn').text(this.files[0].name)
		}
	});
	registerBtn.addEventListener('click', function() {
		var gen = $('#gender').val()
		var genC = false;
		if(gen == '空'){
			$('#genText').text("请选择性别！")
		}else{
			genC = true
		}
		if(usernameC && passwordC && genC){
			
			
			let formData = new FormData();
			var rebtn = $('#registerBtn')
			var username = $('#username').val()
			var password = $('#passwords').val();
			
			var date = $('#birthday').val()
			var headImg = $('#headImg')[0]
			formData.append('username',username)
			formData.append('password',password)
			formData.append('gen',gen)
			formData.append('date',date)
			formData.append('headImg',headImg.files[0])
			$.ajax({
				url: "addUser",
				type: 'POST',
				data: formData,
				contentType: false,          // 必须设置为 false
			    processData: false, 
				success: function(data) {
					
					if(data == "用户名重复"){
						$("#statusText").text(data)
					}else{
						registerCard.classList.remove('loaded');
						registerCard.classList.add('unLoaded');
						sig.classList.remove('show');
						sig.classList.add('hidden');
						log.classList.remove('hidden');
						log.classList.add('show');
						loginCard.classList.add('loaded');
					}
				},
				error: function(xhr, status, error) {
				    console.log('Error:', status, error);
				},
				dataType: 'text'
			})
		}
	})
});